// 引入创建slice的函数
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'

// 单独的异步操作方法
// 参数1: 声明的请求路径
// 参数2: 回调函数，要求返回一个 Promise 实例
export const ASYNC_CHANGE = createAsyncThunk('users/async_change', (n) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(n)
            // reject(100)
        }, 2000)
    })
})


const slice = createSlice({
    // 别名
    name: 'users',
    // 初始值
    initialState: {
        msg: '',
        name: '迪丽热巴',
        age: 20
    },
    // initialState: ['迪丽热巴'],
    // 执行方法
    // reducers: {
    //     changeState(state, action) {
    //         // state 是引用数据类型
    //         // return state = action.payload
    //         // state.name = action.payload.name
    //         state.push(action.payload)
    //     }
    // },

    // 异步回调的处理配置
    extraReducers: {
        [ASYNC_CHANGE.pending](state, action) {
            // 处理中
            state.msg = '处理中...'
        },
        [ASYNC_CHANGE.fulfilled](state, action) {
            state.msg = '处理成功.'
            // 处理成功
            state.name = action.payload
        },
        [ASYNC_CHANGE.rejected](state, action) {
            state.msg = '处理失败.'
            // 处理失败
        }
    }
})

export let {changeState} = slice.actions;

// 导出切片
export default slice.reducer